<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>无标题文档</title>
        <link href="${pageContext.request.contextPath}/css/mainframe.css" rel="stylesheet" type="text/css" />
		<script type="text/javascript" src="./js/prototype.js" ></script>
    </head>

<style>
body{
font-size:13px;
color:#333;
line-height:175%;
margin:0 auto;
background:#fff;
}
</style>
<body leftmargin="0" topmargin="0">
  <table border="0" width="100%" cellpadding="0" bgcolor="#ffffff">
   <tr> <td align="center">
   <div style="width:98%;">
    <fieldset><legend>JSON实战</legend>
    	<div align="center" id="json"></div>
        <table id="tb" width="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#9eb3d0">
            <tr>
                <th width="18%">书馆：</th>
                <td width="61%" colspan="3"></td>
			</tr>
		</table>
   </fieldset>
   <div><button class="btn_input" value="" onclick="testAjax();"><img src="${pageContext.request.contextPath}/images/ico_chuli.png" />处理</button>
   </div>  
</div></td></tr>
</table>
<script type="text/javascript">
/*XML:
<?xml version="1.0" encoding="utf-8"?>
<section>
	<title>上海图书馆</title>
	<signing>
		<author title="张先生" name="张三" />
		<book title="java" price="$22.95" />
	</signing>
	<signing>
		<author title="李先生" name="李四" />
		<book title="C++" price="$12.95" />
	</signing>
</section>
Java类：
public class Section{
	private String title;
	private List<Signing> signList=new ArrayList<Singing>();
	或者private Signing[] signArray=new Signing[2];
}
public class Author{
	private String title;
	private String name;
}
public class Book{
	private String title;
	private String name;
}
public class Signing{
	private Author author;
	private Book book;
}
json表达式：实质是关联数组(键值对)
{'title':'上海图书馆',"signArray":[
{"author":{"title":"张先生","name":"张三"},"book":{"title":"java","price":"$22.95"}},
{"author":{"title":"李先生","name":"李四"},"book":{"title":"C++","price":"$12.95"}}]};
*/
function testAjax(){
	var url = "testJson.action?operType=ajax";
	var myAjax = new Ajax.Request(url, {
		method : 'get',
		onComplete : callBack
		}
	);
}
function callBack(req){
	if(req.responseText!=null){
		document.all.json.innerHTML=req.responseText;
		testJSON(req.responseText);
	}
}
function testJSON(section){
	/*
	构建JSON对象(Object)的两种方式：
	1)JSON字符串：var s="{"title":"上海图书馆"}";解析： var obj=eval("("+s+")");
	2),JSON代码：var obj={"title":"上海图书馆"};
	*/
	var obj=eval("("+section+")");//section是string对象,alert(typeof section);
	document.getElementById('tb').rows[0].cells[1].innerHTML=obj.title;
	clearTb(document.getElementById('tb'));
	for(i=0;i<obj.signArray.length;i++){
		var title=obj.signArray[i].author.title;
		var name=obj.signArray[i].author.name;
		var book=obj.signArray[i].book.title;
		var price=obj.signArray[i].book.price;
		var tb=document.getElementById('tb');
		var tr=tb.insertRow(tb.rows.length);
		var td1=tr.insertCell(tr.cells.length);
		var td2=tr.insertCell(tr.cells.length);
		var td3=tr.insertCell(tr.cells.length);
		var td4=tr.insertCell(tr.cells.length);
		td1.innerHTML=title;
		td2.innerHTML=name;
		td3.innerHTML=book;
		td4.innerHTML=price;
	}
}
function clearTb(tb){
	for(i=tb.rows.length-1;i>=1;i--){
		tb.deleteRow(i);
	}
}
</script>
</body>
</html>